<#include "/public/macro.html">
<div class="uk-layui-form">
    <form class="layui-form uk-form" action="" data-toggle="ajax-form" data-inner="#callCenterContent" data-message="false">
    	<input type="hidden" name="hostid" value="${pbxHost.id!''}">
    	<input type="hidden" name="id" value="${siptrunk.id!''}">
       	
       	<div class="layui-colla-item">
			<h2 class="layui-colla-title">配置归属地动态路由</h2>
			<div class="layui-colla-content layui-show">
				
				<div class="layui-form-item" id="expressdiv">
					<div class="layui-inline">
						<label class="layui-form-label" style="width: 95px;"><span class="sortable-item" style="margin-right:20px;"><i class="layui-icon layui-icon-shrink-right"></i></span>归属地：</label>
						<div class="layui-input-inline" style="width:80px;">
							<@select "com.dic.address.area" "province" "" "lay-ignore" "width:85px;"/>
						</div>
					</div>
					<div class="layui-inline">
						<div class="layui-input-inline" style="width:80px;" id="contacts_city">
							<@select "com.dic.address.area.city" "city" "" "lay-ignore" "width:86px;"/><!-- 二级字典，不存在的 CODE -->
						</div>
						<i style="color: red;">*</i>
					</div>
					
					<div class="layui-inline">
						<label class="layui-form-label" style="width: 50px;">网关：</label>
						<div class="layui-input-inline" style="width:175px;">
							<select name="gatewayid" id="gatewayid">
								<option value="">请选择网关</option>
								<#list siptrunkList as siptrunk>
									<option value="${siptrunk.id}">${siptrunk.name!''}</option>
								</#list>
							</select>
						</div>
						<i style="color: red;">*</i>
					</div>
					
					<div class="layui-input-inline" style="width: 50px;float: right;" title="批量删除动态路由">
						<a href="javascript:;" onclick="batDel(this)" data-toggle="tip" data-title="请确认是否删除选中的动态路由？" data-target="#mainajaxwin" data-callback="execAllAuth" class="layui-btn" style="padding: 0;width: 60px;float: right;"><i class="layui-icon" style="font-size: 30px;margin: 0;">&#xe640;</i></a>
					</div>
					<div class="layui-input-inline" style="width: 50px;float: right;padding-right: 15px;" title="添加动态路由" >
						<a href="javascript:;" onclick="getkey(this)" data-toggle="tip" data-title="请确认是否添加该动态路由？" data-target="#mainajaxwin" data-callback="execAllAuth" class="layui-btn" style="padding: 0;width: 60px;"><i class="layui-icon" style="font-size: 30px;margin: 0;">&#xe61f;</i></a>
					</div>
					
				</div>
			</div>
				
		</div>
		<div class="layui-colla-item">
			<h2 class="layui-colla-title">
				已配置的动态路由（${dynamicList?size}）
						
			</h2>
			<table class="layui-table" lay-skin="line">
				  <thead>
				  	<#if dynamicList?? && dynamicList?size gt 0 >
					<colgroup>
						<col width="1%">
						<col width="20%">
						<col width="20%">
						<col width="10%">
						<col width="1%">
						<col>
				  </colgroup>
					<tr>
					  <th>
						<input type="checkbox" id="ischange" lay-filter="ischange"/>
					  </th>
					  <th style="white-space:nowrap;">省</th>
					  <th style="white-space:nowrap;">市</th>
					  <th style="white-space:nowrap;">网关</th>
					  <th style="white-space:nowrap;">操作</th>
					</tr> 
					</#if>
				  </thead>
				  <tbody>
					<#if dynamicList?? && dynamicList?size gt 0 >
					<#list dynamicList as dynamic>
					<tr>
					  <td style="width:1%;">
						<input type="checkbox" class="ids" name="ids" value="${dynamic.id!''}"/>
					  </td>
					  <td><#if uKeFuDic[dynamic.province!''].name??>${uKeFuDic[dynamic.province!''].name!''}</#if></td>
					  <td><#if uKeFuDic[dynamic.city!''].name??>${uKeFuDic[dynamic.city!''].name!''}</#if></td>
					  <td>
					  	<#if dynamic.gatewayid??>
					  		<#if siptrunkList??>
					  			<#list siptrunkList as siptrunk>
					  				<#if siptrunk.id == dynamic.gatewayid>${siptrunk.name!''}</#if>
					  			</#list>
					  		</#if>
					  	</#if>
					  </td>
					  
					  <td >
					  		<a href="/admin/callcenter/siptrunk/dynamic/delete.html?dynamicid=${dynamic.id!''}&hostid=${pbxHost.id!''}&id=${siptrunk.id!''}" id="delauth"   style="margin-left:10px;" data-toggle="tip"  data-title="请确认是否删除该动态路由配置？" data-target="#mainajaxwin" data-callback="execDelAction">
					  			<i class="layui-icon" style="color:red;font-size: 20px;">&#xe640;</i>
					  		</a>
					  </td>
					</tr>
					</#list>
					<#else>
						<div class="ukefu-empty" style="height: 200px;">
							<i class="layui-icon"></i>
							<div style="">
								还没有动态路由配置记录
							</div>
						</div>
					</#if>
				  </tbody>
				</table>
				
			</div>
		</div>
		
        <div class="layui-form-button">
            <div class="layui-button-block">
                <button  class="layui-btn layui-btn-primary" onclick="layer.close(layer.index);">关闭</button>
            </div>
        </div>
    </form>
</div>

<script>
//Demo
	$('#province').change(function(){
		loadURL('/res/dic.html?id='+$(this).val()+"&name=city&attr=lay-ignore&style=width:85px;display:inline-block;" , '#contacts_city');
	})
	
	var form ;
	layui.use('form', function(){
	  form = layui.form;
	  form.render();
	  
	  form.on("select(newMetrics)",function(data){
			newMetrics();
			form.render(); 
		});
	  
	  form.on('checkbox(ischange)',function(data){
			var a = data.elem.checked;
			if(a == true){
				$(".ids").prop("checked", true);
				form.render('checkbox');
			}else{
				$(".ids").prop("checked", false);
				form.render('checkbox');
			}
		});
	});
	layui.use('element', function(){
		var element = layui.element;
	});
	function newMetrics(){
		$('#mertics').append($('#tpl').text());
		
		form.render('select'); //刷新select选择框渲染
		
	}
	function removeItem(obj){
		
		$(obj).closest(".ukefu-item-word").remove();
	}
	function execDelAction(url , target){
		loadURL(url, target) ;
		
	}
	function execAllAuth(url , target){
		loadURL(url, target) ;
		
	}
	function getkey(a) {
        var pms = 'province=' + document.getElementById("province").value 
        + '&city=' +  document.getElementById("city").value 
        + '&gatewayid=' +  document.getElementById("gatewayid").value 
        + '&hostid=${pbxHost.id!''}'
        + '&id=${siptrunk.id!''}'
        ;
	  	a.href = '/admin/callcenter/siptrunk/dynamic/save.html?' + pms;
	 }
	function batDel(a) {
		var pms = '&hostid=${pbxHost.id!''}'
        + '&id=${siptrunk.id!''}'
        ;
		var ids = "";
		var num = 0 ;
		$('.ids').each(function(){
			if($(this).prop("checked")){
				if(ids!=""){
					ids += "&" ;
				}
				ids += "ids=" + $(this).val();
				num++;
			}
		});
		if(num>0){
	  		a.href = '/admin/callcenter/siptrunk/dynamic/batdel.html?' + pms+"&"+ids;
		}
	 }

</script>
